{extend name="layout/layout" /}

{block name="navbar"}{/block}

{block name="style"}
	<style>
		body, .mui-content{
			background: #fff;
		}

		.login{
			padding: 30px 20px;
		}

		.mui-input-group:before, .mui-input-group:after{
			height: 0;
		}

		.logo{
			margin-bottom: 20px;
		}

		.logo img{
			max-width: 100px;
		}

		.mui-input-row label{
			width: 20%;
			text-align: center;
		}

		.mui-input-row label~input{
			width: 80%;
			font-size: 14px;
		}

		.forget{
			margin-top: 20px;
			font-size:12px;
		}

		.forget a{
			text-decoration: underline;
		}

	</style>
{/block}

{block name="main"}
	<div class="login" v-cloak>
		<div class="logo mui-text-center">
			<!-- <img src="/assets/img/logo.jpg"  alt=""> -->
		</div>

		<form class="mui-input-group">
			<div class="mui-input-row">
				<label><i class="mui-icon iconfont icon-weibiaoti2fuzhi12"></i></label>
				<input type="text" name="username" v-model="username" class="mui-input-clear" placeholder="请输入用户名">
			</div>

			<div class="mui-input-row">
				<label><i class="mui-icon iconfont icon-mima"></i></label>
				<input type="password" name="password" v-model="password" class="mui-input-password" placeholder="请输入密码">
			</div>

			<button class="mui-btn mui-btn-block mui-btn-theme" type="button" @tap="login()">登录</button>

			<a href="/mobile/user/register" class="mui-btn mui-btn-block mui-btn-theme mui-btn-outlined">注册</a>

			
			<a :href="downUrl" v-if="downUrl" class="mui-btn mui-btn-block mui-btn-theme mui-btn-outlined">下载APP</a>

			<div class="forget mui-text-center">
				<a href="{:url('user/findPassword')}" class="text-gray">忘记密码?</a>
			</div>

		</form>
	</div>
{/block}

{block name="script"}
	<script>

		var myVue = new Vue({
			el:'.login',
			data:{
				username: '',
				password:'',
				downUrl: '{$downUrl}'
			},
			mounted: function(){
				if(token){
					mui.back();
				}
			},
			methods: {
				login:function(){
					if(!this.username) {
						mui.toast('用户名不能为空');
						return;
					}

					if(!this.password) {
						mui.toast('登录密码不能为空');
						return;
					}

					var url =  'user/login';
					var that = this;

					request(that, {'url': url,'data': {account:that.username, password:that.password}},function(res){
						if(res.code == 200) {
							console.log(res.data);
							localStorage.setItem('token', res.data.userinfo.token);
							localStorage.setItem('merid', res.data.userinfo.merid);
							//把token传到后台php保存到session
							that.$http.post("{:url('user/token')}",{token:res.data.userinfo.token},{emulateJSON : true});
							mui.toast(res.msg);
							mui.back();
						} else {
							mui.toast(res.msg);
						}	
					});

				}
			}
		});
	</script>
{/block}